<template>
    <div class="goodsItem">
        <div class="goodImg">
            <img src="../assets/logo.png" alt="">
        </div>
        <div class="goodMsg">
            <div class="goodName">{{data.name}}</div>
            <div class="goodContent">{{data.content}}</div>
        </div>
    </div>
</template>

<script>
    export default {
        props:["data"],
        data(){
            return{

            }
        },
    }
</script>

<style lang="scss">
    .goodsItem{
        width: 500px;
        height:200px;
        border: solid 1px red;
        display: flex;
        /*justify-content:space-between;*/
        align-items: center;
        .goodImg{
            width: 150px;
            height:150px;
            margin-left:16px;
            img{
                width:100%;
                height:100%;
            }
        }
        .goodMsg{
            flex: 1;
            display: flex;
            flex-direction:column;
            height:100%;
            .goodName{
                height: 80px;
            }

        }
    }
</style>